import React, { Component } from 'react'
import 'element-theme-default';
import ScoreLi from './ScoreList.module.css'
import axios from 'axios';

export default class ScoreList extends Component {
 
  
    state = {
      scores:[],
    }

  componentDidMount(){
    this.CheckAllScore();
  }

  CheckAllScore(){
    axios.get('/ScoreList/user/getAllScore/1/10').then(
			response => {console.log('成功了',response.data.data.list);
			this.setState({scores:response.data.data.list})
		},
			error => {console.log('失败了',error);}
		)
  }

  EnterQurey = (id) =>{
    let history = this.props.history;
    history.push(`/Sidebar/ScoreQuery/${id}`)
  }

  Scoresearch = () =>{
    const {queryStuIDElement:{value:queryStuID}} = this
    console.log(queryStuID)
     axios.get('/ScoreList/user/getScoreXue/'+queryStuID).then(
      response => {console.log('成功了',response.data);
      let a = []
      a.push(response.data.data)
				this.setState({scores:a})
        console.log(queryStuID,a)
		},
			error => {console.log('失败了',error);}
    )
  }

  render() {
    const {scores} = this.state
    return (
      <div>
      <table width="50%" className={ScoreLi.table}>
        <caption>
          <h2>
            学生成绩查询
          </h2>
        </caption>
        <div className={ScoreLi.search}>
          <div className={ScoreLi.inputfrom}>
            <input placeholder="请输入学号/教工号" type="text" ref={c => this.queryStuIDElement = c}/>
            <button onClick={this.Scoresearch}></button>
          </div>
        </div>
        <thead>
          <tr>
            <th>学号/教工号</th>
            <th>姓名</th>
            <th>学院</th>
            <th>总分</th>
            <th>操作</th>
          </tr>
        </thead>
        {scores?.map((score)=>(
        <tr key={score.id}>
          <td>{score.stuID}</td>
          <td>{score.name}</td>
          <td>{score.college}</td>
          <td>{score.total}</td>
          <td>
            <div className="btn-group" role="group">
            <button type="button" className="btn btn-info btn-sm" onClick={() =>this.EnterQurey(score.stuID)}>查看</button>
            </div>
          </td>
        </tr>)
        )}
      </table>
    </div>
    )
  }
}
